import React, { PureComponent } from 'react'
import OriginCpn from './originCpn';
import ThemContext from '../context';
const info ={
    name:'张三',
    height:'180',
    age:26,
    weight:150
}

function originFn(Cpn){
    class originCurrentCpn extends PureComponent{
        constructor(){
            super();
            this.state = {...info}
        }
        render(){
            console.log(this.state);
            return <Cpn {...this.props} {...this.state}/>
        }
    }
    return originCurrentCpn;
}
originComponent
const Prefile = OriginCpn((props) => {
  console.log(props, '123123');
  return <h2>{props.name}</h2>;
});

const PreContext = originFn((props)=>(<span>{props.age}</span>))

function currentCpn(Cpn){
    class setUpCpn extends PureComponent{
        render(){
            return(
                <>
                <Cpn />
                 <h2>复用</h2>
                </>
            )
        }
    }
    return setUpCpn;
}


class Children extends PureComponent{
    render(){
        return(
            <h1>你好这是传递给函数组件的类组件</h1>
        )
    }
}

const NewCpn = currentCpn(Children);


export class App extends PureComponent {
  render() {
    return (
        <ThemContext.Provider value={{ color: 'red', size: 30 }}>
        <div><NewCpn /></div>
        <p>组件增强:  <Prefile/></p>
        <p>组件增强2:  <PreContext/></p>
        </ThemContext.Provider>
    )
  }
}

export default App